import { reactive } from 'vue';
import axios from 'axios';

interface resultData<T> {
  result: T | null,
  loading: boolean,
  loaded: boolean,
  error: any
}

export const useURLLoader = <T>(url: string) => {
  const data = reactive<resultData<T>>({
    result: null,
    loading: true,
    loaded: false,
    error: null
  })

  axios.get(url).then(res => {
    data.result = res.data;
    data.loaded = true;
  }).catch(err => {
    data.error = err
  }).finally(() => {
    data.loading = false
  })

  return data
}

